<template>
  <h1>El组件-单选</h1>
  <el-radio-group v-model="gender">
    <el-radio label="男" value="1"></el-radio>
    <el-radio label="女" value="0"></el-radio>
  </el-radio-group>
  <h4>您要提交的值:{{ gender }}</h4>
  <hr>
  <el-radio-group v-model="edu">
    <el-radio label="学历:本科" value="bk"></el-radio>
    <el-radio label="学历:大专" value="dz"></el-radio>
    <el-radio label="学历:高中" value="gz"></el-radio>
    <el-radio label="学历:初中" value="cz"></el-radio>
  </el-radio-group>
  <h4>您选择的结果是：{{ edu }}</h4>
  <hr>

  <!--  <el-radio-group v-model="level">-->
  <!--    <el-radio label="员工" value="10"></el-radio>-->
  <!--    <el-radio label="经理" value="20"></el-radio>-->
  <!--    <el-radio label="总监" value="30"></el-radio>-->
  <!--    <el-radio label="总裁" value="40"></el-radio>-->
  <!--  </el-radio-group>-->

  <el-radio-group v-model="level">
    <el-radio v-for="item in arr" :label="item.level" :value="item.value"></el-radio>
  </el-radio-group>
  <h4>您选择结果是：{{ level }}</h4>
  <hr>

  <el-radio-group v-model="pr">
    <el-radio-button v-for="p in arr2" :label="p.title" :value="p.price"></el-radio-button>
  </el-radio-group>
  <h4>您选择的酒价是：{{ pr }}</h4>


</template>

<script setup>
import {ref} from "vue";

const gender = ref('1');
const edu = ref('bk')
const level = ref('10')
const arr = ref([
  {level: '员工', value: '10'},
  {level: '经理', value: '20'},
  {level: '总监', value: '30'},
  {level: '总裁', value: '40'},
  {level: 'CEO', value: '50'}
]);
const pr = ref('368');
const arr2 = ref([
  {title: '五粮液', price: 500},
  {title: '茅台', price: 2500},
  {title: '汾酒', price: 330},
  {title: '梦之蓝', price: 368},
]);
</script>


<style scoped>

</style>